
@-webkit-keyframes zoomOutIn {
	0% {
		opacity: 0;
		-webkit-transform: scale3d(1.2, 1.2, 1.2);
		transform: scale3d(1.2, 1.2, 1.2);
	}
	
	70% {
		opacity: 1;
	}
}

@keyframes zoomOutIn {
	0% {
		opacity: 0;
		-webkit-transform: scale3d(1.2, 1.2, 1.2);
		transform: scale3d(1.2, 1.2, 1.2);
	}
	
	70% {
		opacity: 1;
	}
}

.zoomOutIn {
	-webkit-animation-name: zoomOutIn;
	animation-name: zoomOutIn;
}

// Vue DropDown animation
.fade1-enter-active,
.fade1-leave-active {
	transform-origin: top;
	transition: opacity $speed-slow $easing, transform $speed-slow $easing;
}

.fade1-enter,
.fade1-leave-to {
	transform: scaleY(0.9);
	opacity: 0;
}

.fade2-enter-active,
.fade2-leave-active {
	transform-origin: top;
	transition: none;
}

.slide1-enter-active {
	transition: 0.66s $easing;
	transition-timing-function: cubic-bezier(0.66, 0, 0.01, 1);
}

.slide1-leave-active {
	transition: 0.66s $easing;
	transition-timing-function: cubic-bezier(0.66, 0, 0.01, 1);
}

.slide1-enter-to,
.slide1-leave {
	max-height: 464px;
	overflow: hidden;
}

.slide1-enter,
.slide1-leave-to {
	overflow: hidden;
	max-height: 0;
}

// custom Zoom in
.c-zoom-in-enter-active,
.c-zoom-in-leave-active {
	transition: opacity $speed-slow $easing, transform $speed-slow $easing;
}

.c-zoom-in-enter,
.c-zoom-in-leave-to {
	transform: scale(0.95);
	opacity: 0;
}


/* Zoom Fade */


/* fade-transform */
.fade-transform-leave-active,
.fade-transform-enter-active {
	transition: all .3s !important;
}

.fade-transform-enter {
	opacity: 0;
	transform: translateX(2rem);
}

.fade-transform-leave-to {
	opacity: 0;
	transform: translateX(-2rem);
}


/* toolbar-transform */

.up-fade-enter-active,
.up-fade-leave-active {
	transform-origin: top;
	transition: opacity $speed-slow $easing, transform $speed-slow $easing;
}

.up-fade-enter,
.up-fade-leave-to {
	transform: translateY(50px);
	opacity: 0;
}

.fade-enter-active,
.fade-leave-active {
	transition: opacity 0.5s;
}

.fade-enter,
.fade-leave-to
	
	/* .fade-leave-active below version 2.1.8 */
{
	opacity: 0;
}

.slide-fade-enter-active {
	transition: all 0.25s ease-out;
}

.slide-fade-leave-active {
	transition: all 0.25s ease-out;
}

.slide-fade-enter,
.slide-fade-leave-to
	
	/* .slide-fade-leave-active for below version 2.1.8 */
{
	transform: translateY(10px);
	opacity: 0;
}

.slide-next-leave-active,
.slide-next-enter-active,
.slide-prev-enter-active,
.slide-prev-leave-active {
	transition-duration: 0.35s;
}
